<template>
    <mt-popup
      v-model="popupVisible"
      popup-transition="popup-fade">
        <div class="pop-dialog">
          <h1>{{title}}</h1>
          <p>{{msg}}</p>
          <div class="g-btn">
            <mt-button class="btn-canal" type="default" @click="cannal">取消</mt-button>
            <mt-button class="btn-ok" type="primary" @click="comit">确定</mt-button>
          </div>
        </div>
    </mt-popup>
</template>

<script>
export default {
  props: {
    popupVisible: {
      type : Boolean
    },
    title: {
      type: String,
      default:'提示!'
    },
    msg: {
      type:String,
      default:'确定要删除吗？'
    }
  },
  data() {
    return {
       errorImg01: 'this.src="' + require('../.././assets/logo.png') + '"'
    }
  },
  methods:{
    cannal(){
      this.popupVisible = false
      this.$emit('cannal');
    },
    comit(){
      this.popupVisible = false
      this.$emit('comit');
    }
  },
  mounted(){
  }

}
</script>

<style lang="stylus">
  .pop-dialog
    width:200px
    height:180px
    h1
      line-height:38px
      font-size:18px
      text-align:center
      border-bottom:1px solid #ccc
      color:#108ee9
      font-weight:700
    p
      line-height:30px
      font-size:16px
      margin:20px
      color:#108ee9
    .g-btn
      clear:both
      margin:10px 20px
      display:flex
      .btn-canal,.btn-ok
        height:35px
      .btn-canal
        flex:0 0 40%
      .btn-ok
        margin-left:10px
        flex:1

</style>